<template>
	<view class="item" @click="toDetail">
		<image class="cover" :src="props.info.image"></image>


		<view class="content">
				<view class="name one-ellipsis">
					<text>{{props.info.title}}啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</text>
				</view>
				
				<view class="discount two-ellipsis">{{props.info.info}}萨法挖水电费萨芬该方法艾师傅艾师傅艾师傅按时啊方式</view>
				<!-- <view class="pay-max">每人限购1件</view>
				 -->
				<!-- <view class="discount">7折</view> -->
<!-- 
			<view class="foot">
				<view class="left">
					<view class="current-price">999</view>
					<view class="pre-price">￥111</view>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script setup>
	import {
		defineProps
	} from 'vue'

	const props = defineProps({
		info: {
			type: Object,
			default: () => ({})
		}
	})

	const toDetail = () => {
		uni.navigateTo({
			url: '/pages/schoolDetail/schoolDetail?id=' + props.info.id
		})
	}
</script>

<style lang="scss" scoped>
	.item {
		display: flex;
		margin-bottom: 14rpx;
		background-color: #edf2fa;
		border-radius: 20rpx;
		padding: 10rpx;
		.cover {
			width: 180rpx;
			height: 180rpx;
			border-radius: 14rpx;
		}

		.content {
			flex: 1;
			display: flex;
			flex-direction: column;
			width: 380rpx;
			.name {
				padding: 10rpx 10rpx 0;
				font-weight: bold;
			}

		// 	.pay-max {
		// 		font-size: 16rpx;
		// 		color: #7e7e7e;
		// 		border: 1rpx solid #c6efec;
		// 		width: fit-content;
		// 		margin: 4rpx 0;
		// 	}

		// 	.desc {
		// 		color: #7e7e7e;
		// 		width: 300rpx;
		// 		white-space: nowrap;
		// 		overflow: hidden;
		// 		text-overflow: ellipsis;
		// 		font-size: 20rpx;
		// 	}

			.discount {
				border-radius: 4rpx;
				width: fit-content;
				font-size: 28rpx;
				color: #828282;
				padding: 10rpx 10rpx 0;
			}

		// 	.foot {
		// 		display: flex;
		// 		align-items: center;
		// 		justify-content: space-between;

		// 		.left {
		// 			display: flex;
		// 			align-items: center;
		// 			.current-price {
		// 				font-weight: bold;

		// 				&:before {
		// 					content: '￥';
		// 					font-size: 26rpx;
		// 				}
		// 			}

		// 			.pre-price {
		// 				text-decoration-line: line-through;
		// 				color: #7e7e7e;
		// 				font-weight: 300;
		// 				font-size: 22rpx;
		// 			}
		// 		}

		// 		.handel-btn {
		// 			background: #F4BE43;
		// 			width: fit-content;
		// 			font-size: 28rpx;
		// 			padding: 4rpx 20rpx;
		// 			border-radius: 24rpx;
		// 			font-size: 24rpx;
		// 		}
		// 	}
		}
	}
</style>